import styled from "styled-components";

export const Right2Warpper = styled.div`
.top-container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 16px 0 16px;
    .item-container{
        flex: 1;
        display: flex;
        align-items: center;
        .icon-box{
            width: 48px;
            height: 48px;
            background: url(${require('@/assets/img/right2-num-bg.png').default}) no-repeat center;
            background-size: 100% 100%;
            ${props => props.theme.mixin.contentCenter}
            }
        .info-content{
            display: flex;
            flex-direction: column;
            padding-left: 8px;
            .label{
                font-size: 16px;
                color: #96AFD5;
                ${props => props.theme.mixin.ellipsisLine1}
            }
            .value{
                font-size: 16px;
                font-weight: 500;
                color: #FFFFFF;
                ${props => props.theme.mixin.ellipsisLine1}
            }
        }
        }
    }

    .chart-container{
        width: 100%;
    }
`
